<!--#include file="common/header.html"-->
<link rel="stylesheet" type="text/css" href="../css/autocomplete.css" media="all">
<body>
    <div class="container-fluid larry-wrapper">
        <div class="row">
            <div class="col-xs-12 col-sm-12 col-md-12">
                <!--头部搜索-->
                <section class="panel panel-padding">
                    <form class="layui-form" action="/education/admin/stats/product" id="queryForm">
                        <div class="layui-form">
                            <div class="layui-inline">
                                <input class="layui-input" name="_query.startDate" placeholder="起始时间"
                                       onclick="layui.laydate({type:'datetime', elem: this, festival:true, istime:true,
                                       max: laydate.now(), format:'YYYY-MM-DD hh:mm:ss'})">
                            </div>
                            <span style="margin-left: 10px;margin-right: 10px">至</span>
                            <div class="layui-inline">
                                <input class="layui-input" name="_query.endDate" placeholder="结束时间"
                                       onclick="layui.laydate({type:'datetime', elem: this, festival:true, istime:true,
                                       max: laydate.now(), format:'YYYY-MM-DD hh:mm:ss'})">
                            </div>

                            <div class="layui-inline" style="margin-left: 20px;">
                                <div class="layui-input-inline">
                                    <input type="text" name="areaName" placeholder="地区搜索"
                                           id="autocompleteInput" autocomplete="off" class="layui-input">
                                </div>
                            </div>

                            <div class="layui-inline" style="margin-left: 20px;">
                                <div class="layui-input-inline">
                                    <input class="layui-input" name="_query.keyword" placeholder="产品关键字">
                                </div>
                            </div>

                            <!--<div class="layui-inline">
                                <div class="layui-input-inline">
                                    <input class="layui-input" name="_query.station_no" placeholder="自提点编号"
                                    type="text" id="autocompleteInput2" autocomplete="off">
                                </div>
                            </div>-->
                            <div class="layui-inline">
                                <div class="layui-input-inline">
                                    <select name="_query.station_id" id="queryStationId" lay-search>
                                        <option value=""></option>
                                    </select>
                                </div>
                            </div>

                            <div class="layui-inline">
                                <div class="layui-input-inline">
                                    <input type="text" name="username" placeholder="下单人手机号"
                                           id="autocompleteInput3" autocomplete="off" class="layui-input">
                                </div>
                            </div>
                            <div class="layui-inline">
                                <div class="layui-input-inline">
                                    <select name="_query.level" lay-search >
                                        <option value="0">本人订单</option>
                                        <option value="1">一级下线</option>
                                        <option value="2">二级下线</option>
                                    </select>
                                </div>
                            </div>

                            <div class="layui-inline">
                                <button lay-submit class="layui-btn" lay-filter="search">查找</button>
                            </div>
                        </div>
                    </form>
                </section>

                <!--列表-->
                <section class="panel panel-padding">
                    <div style="text-align: right" id="totalMsg"></div>
                    <div id="list" class="layui-form"></div>

                    <div class="text-right" id="page"></div>

                </section>
            </div>
        </div>
    </div>

</body>
<script id="list-tpl" type="text/html"
        data-params='{"url":"/education/admin/stats/product","dataName":"statsProductData","pageid":"#page", "method":"post", "complete":"afterTableLoad"}'>
    <table id="example" class="layui-table lay-even" data-name="statsProductData" data-tplid="list-tpl">
        <thead>
        <tr>
            <th width="30"><input type="checkbox" id="checkall" data-name="checkbox" lay-filter="check"
                                  lay-skin="primary"></th>
            <th>商品编号</th>
            <th>名称</th>
            <th>现价(元)</th>
            <th>库存</th>
            <th>销量(kg)</th>
            <th>数量(件)</th>
            <th>销售金额(元)</th>
            <th>市场价销量(元)</th>
            <th>会员价销量(元)</th>
            <th>操作</th>
        </tr>
        </thead>
        <tbody>
        {{# layui.each(d.list, function(index, item){ }}
        <tr>
            <td><input type="checkbox" name="checkbox" value="{{ item.id}}" lay-skin="primary"></td>
            <td>{{ item.product_no }} </td>
            <td>{{ item.product_name }} </td>
            <td>{{ item.product_price }} </td>
            <td>{{ item.product_stock }} </td>
            <td style="font-family: 'Times New Roman'">{{ item.totalweight/1000||0 }} kg</td>
            <td>{{ item.totalamount || 0}} 件</td>
            <td>{{ toFix(item.totalprice)}} 元 </td>
            <td>{{ toFix(item.totalprice - item.totalvipprice) }} 元 </td>
            <td>{{ toFix(item.totalvipprice)}} 元 </td>
            <td><button class="layui-btn layui-btn-mini"
                        onclick="_viewDetail('{{item.id}}','{{item.product_name}}');">明细</button>
            </td>
        </tr>
        {{# }); }}
        </tbody>

    </table>
</script>
<script src="../js/layui/layui.js"></script>
<script type="text/javascript" src="../js/lib/jquery-1.11.2.min.js"></script>
<script type="text/javascript" src="../js/lib/rest.js"></script>
<script type="text/javascript" src="../js/lib/bootstrap.autocomplete.js"></script>
<!--#include file="common/version.html"-->
<script>
    layui.use('user_list');

    function toFix(a) {//console.log(a + ' ' + a.toFixed(2));
        return (a || 0) && Number(a).toFixed(2)
    }

    function beforeChoice(){
        var index = layer.open({
            type: 2,
            content: "area-tree.html", "title": "选择地区", "area": ['500px', '600px'], "maxmin":"true"
        });
    }

    function choiceDept(item){
        $('input[name="_query.areaId"]').val(item.id);
        $('input[name="parentname"]').val(item.name);
    }

    function afterTableLoad(data) {
        var str = '总销量：{a}件，总金额：{b}万元（其中：会员价销量{c}万元）';
        str = str.replace(/{a}/, (data.extData.totalAmount||0))
            .replace(/{b}/, ((data.extData.totalPrice||0)/10000).toFixed(2))
            .replace(/{c}/, ((data.extData.totalVipPrice||0)/10000).toFixed(2))
        $('#totalMsg').html(str)
//        $('#totalMsg').html('总销量：' + (data.extData.totalAmount||0) + '件，总金额：'
//            + ((data.extData.totalPrice||0)/10000).toFixed(2) + '万元');
    }

    function _viewDetail(ids, name){
        var index = layer.open({
            type: 2,
            content: "stats-product-sku.html?ids=" + ids, "title": '【'+ name +"】规格统计", "full":"true"
        });
        layer.full(index);
    }

    function sortBy(col, mode) {
        /*var json = JSON.parse($("#list-tpl").attr('data-params'));
        json['data'] = 'orderColunm=' + col + '&orderMode='+mode;
        $("#list-tpl").attr('data-params', JSON.stringify(json));
        layui.use(['jquery', 'dtable', 'jqdate', 'jqform', 'upload'], function(exports) {
            var $ = layui.jquery,
                list = layui.dtable,
                oneList = new list();

            oneList.init('list-tpl');
        });*/
    }

    $.fn.serializeObject = function() {
        var o = {};
        var a = this.serializeArray();
        $.each(a, function() {
            if (o[this.name]) {
                if (!o[this.name].push) {
                    o[this.name] = [ o[this.name] ];
                }
                o[this.name].push(this.value || '');
            } else {
                o[this.name] = this.value || '';
            }
        });
        return o;
    }
</script>
<script>
    function initData() {
        var arr = ['<option value=" ">请选择自提点</option>'];
        restPost('/education/admin/station', {'pageSize':200}, function(rs){
            if(rs.status == 200){
                for(var $i=0; $i< rs.data.list.length; $i++){
                    var d = rs.data.list[$i];
                    arr.push('<option value="{v}">{n}</option>'.replace('{v}', d['id'])
                        .replace('{n}', d['station_name']));
                }
                $('#queryStationId').html(arr.join(''));
            }
        });
    }
    $(function(){
        $('#autocompleteInput').autocomplete({
            source:function(query,process){
                var matchCount = this.options.items;//返回结果集最大数量
                $.post("/education/admin/area/query",{"keyword":query, 'level':3},function(respData){
                    console.log(respData);
                    if(respData.code == 200 || respData.status == 200) {
                        return process(respData.data);
                    }
                });
            },
            formatItem:function(item){
                var name = item["name"] || '';
                var username = item["parent_name"] || '';
//                return name +"("+ username + ")";
                return username + '-' + name;
            },
            setValue:function(item){
                return {'data-value':item["parent_name"]+'-'+item["name"],'real-value':item["id"]};
            }
        });
        $('#autocompleteInput2').autocomplete({
            source:function(query,process){
                var matchCount = this.options.items;//返回结果集最大数量
                $.post("/education/admin/station/query",{"keyword":query},function(respData){
                    console.log(respData);
                    if(respData.code == 200 || respData.status == 200) {
                        return process(respData.data);
                    }
                });
            },
            formatItem:function(item){
                var no = item["station_no"] || '';
                var name = item["station_name"] || '';
                return name.slice(0, 10) +"("+ no + ")";
            },
            setValue:function(item){
                return {'data-value':item["station_no"],'real-value':item["id"]};
            }
        });
        $('#autocompleteInput3').autocomplete({
            source:function(query,process){
                var matchCount = this.options.items;//返回结果集最大数量
                $.post("/education/admin/user/query",{"keyword":query},function(respData){
                    console.log(respData);
                    if(respData.code == 200 || respData.status == 200) {
                        return process(respData.data);
                    }
                });
            },
            formatItem:function(item){
                var name = item["name"] || '';
                var username = item["username"] || '';
                return name +"("+ username + ")";
            },
            setValue:function(item){
                return {'data-value':item["username"],'real-value':item["username"]+'-'+item["id"]};
            }
        });
    });
</script>
</html>